<div th:fragment=header(title)>
<link rel="shortcut icon" th:href="@{/favicon.ico}">
<link th:href="@{/css/font-awesome.min.css}"rel="stylesheet">
<link th:href="@{/web/css/base.css}" rel="stylesheet">
<link th:href="@{/web/css/index.css}" rel="stylesheet">
<link th:href="@{/web/css/m.css}" rel="stylesheet">
<script src="https://hm.baidu.com/hm.js?f655f558c510211e38805f6b586e6b15"></script>
	<script th:src="@{/web/js/jquery-1.8.3.min.js}"></script>
	<script th:src="@{/web/js/comm.js}"></script>
<style>
	* {
		cursor: url('/web/images/ani/a.cur'), auto;
	}

	a {
		cursor: url('/web/images/ani/b.cur'), auto;
	}
</style>
<header id="header">
	<div class="navbox">
		<h2 id="mnavh">
			<span class="navicon"></span>
		</h2>
		<div class="logo">
			<a href="/web">山有木兮 | <font class="font16">只要还有明天，今天就永远是起跑线</font></a>
		</div>
		<nav>
			<ul id="starlist">
				<li><a href="/web/index" title="首页" >网站首页</a></li>
				<li><a href="/web/list">技术博客</a></li>
				<li class="menu"><a href="javascript:">技术专栏</a>
					<ul class="sub">
						<li></li>
					</ul> <span></span></li>
				<li><a href="/web/resource">资源分享</a></li>
				<li><a href="/find/13015.html">网站介绍</a></li>
				<li><a href="/web/about">关于我</a></li>
				<li><a href="/web/message">留言</a></li>
			</ul>
		</nav>
		<div class="searchico"></div>
	</div>
</header>

<div class="searchbox">
	<div class="search">
		<form action="/result" name="searchform" method="post" id="searchform">
			<input name="keyboard" id="keyboard" class="input_text"
				   value="请输入关键字词" style="color: rgb(153, 153, 153);"
				   onfocus="if(value=='请输入关键字词'){this.style.color='#000';value=''}"
				   onblur="if(value==''){this.style.color='#999';value='请输入关键字词'}"
				   type="text"> <input name="Submit" class="input_submit"
									   value="搜索" type="submit">
		</form>
	</div>
	<div class="searchclose"></div>
</div>
<script type="text/javascript" color="255,140,0" opacity='0.7' zIndex="-1" count="99" src="//cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>
<script type="text/javascript">
	(function() {
		var hm = document.createElement("script");
		hm.src = "https://hm.baidu.com/hm.js?f655f558c510211e38805f6b586e6b15";
		var s = document.getElementsByTagName("script")[0];
		s.parentNode.insertBefore(hm, s);
	})();

	//初始化所有类别信息
	var initAllBlogType = function() {
		//查询出文章类别
		//设置参数，表示查询所有的类别
		var params = {
			pageSize : 100, //每页显示数量
			pageNum : 1, //当前页
		};
		$.ajax({
			url : '/web/article/getColumnList',
			type : 'post',
			data : params,
			dataType : 'json',
			success : function(data) {
				var typeName = '';
				var data = data.data;
				for (var i = 0; i < data.length; i++) {
					typeName += "<li><a href='/web/column/"+data[i].columnId +"'>"+ data[i].columnName + "</a></li>";
				}
				$(".sub").html(typeName);
			},
			error : function() {
				layer.msg('请求太快，请稍后再试！', {
					icon : 5
				});
			}
		});
	};
	/*鼠标特效 */
	/*这个方法用来随机一个十六进制颜色代码，让每一次点击浮动文字的杨色不同*/
	function co() {
		var colorElements = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f";
		var colorArray = colorElements.split(",");
		var color = "#";
		for (var i = 0; i < 6; i++) {
			color += colorArray[Math.floor(Math.random() * 16)];
		}
		return color;
	}
	var a_idx = 0;

	jQuery(document).ready(function($) {
		initAllBlogType();
		$("body").click(function(e) {
			/*这个数组中的每一个字符是你要浮动显示的词或句子，每次点击鼠标后按顺序出现*/
			var a = ["你好", "哈喽", "安宁哈塞要", "萨瓦迪卡", "恐你期挖","得比奥捏特"];
			var $i = $("<span/>").text(a[a_idx]);
			a_idx = (a_idx + 1) % a.length;
			var x = e.pageX,
					y = e.pageY;
			$i.css({
				"z-index" : 999999,
				"top" : y - 20,
				"left" : x,
				"position" : "absolute",
				"font-weight" : "bold",
				"color" : co()
			});
			$("body").append($i);
			$i.animate({
						"top" : y - 180,
						"opacity" : 0
					},
					1500,
					function() {
						$i.remove();
					});
		});
	});
</script>
</div>

<div th:fragment="footer">
	<script th:src="@{/web/js/index.js}"></script>
	<script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
	<script th:src="@{/web/js/plugins/sweetalert/sweetalert.min.js}"></script>
</div>